.box {
  width: 100% !important;
  border-radius: 11px;
}


// 导出数据样式
.checkbox-item {
  margin: 5px !important;
  width: 150px;
}

.tab-box {
  display: flex;
  align-items: center;

  ::v-deep .el-tabs__nav-wrap {
    &::after {
      display: none;
    }
  }

  ::v-deep .el-tabs__item {
    font-weight: 400;
    font-size: 14px;
    color: #828a9d;
    padding: 0 !important;
    margin-right: 40px;
    transition: all 0.2s;
    // line-height: 55px;
  }

  ::v-deep .is-active {
    font-weight: 500;
    font-size: 14px;
    color: #3b75ff;
    position: relative;

    &::after {
      content: "";
      position: absolute;
      width: 27px;
      height: 3px;
      background: #3b75ff;
      border-radius: 1px;
      bottom: 0;
      left: 50%;
      transform: translate(-50%, 0);
    }
  }

  ::v-deep .el-tabs__active-bar {
    background: #3b75ff;
    display: none;
  }
}


.export-scroll {
  width: 100%;
  max-height: 45vh;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 10px 0;
  box-sizing: border-box;
}

.search-box {
  width: 100%;
  padding: 15px 15px;
  box-sizing: border-box;
  border-bottom: 1px solid #f5f7fa;
  background-color: #fff;
  margin-bottom: 15px;
  border-radius: 11px;

  .search-top-box {
    display: flex;
    width: 100%;
    // height: 40px;
    justify-content: space-between;
    overflow: hidden;

    .search-top-left-box {
      // max-width: 1310px !important;
      // min-width: 700px !important;
      width: 90%;

      ::v-deep .el-form-item {
        margin-bottom: 0;
        // width: 20%;
      }

      .form-width {
        width: 200px; //200px 20%
      }

      ::v-deep .el-date-editor {
        .el-range__icon {
          line-height: 30px;
        }

        .el-range-separator {
          line-height: 30px;
          font-size: 12px;
        }
      }
    }

    .search-top-right-box {
      height: 40px;
      display: flex;
      align-items: center;
      white-space: nowrap;

      p {
        -webkit-touch-callout: none;
        /* iOS Safari */
        -webkit-user-select: none;
        /* Chrome/Safari/Opera */
        -khtml-user-select: none;
        /* Konqueror */
        -moz-user-select: none;
        /* Firefox */
        -ms-user-select: none;
        /* Internet Explorer/Edge */
        user-select: none;
        /* Non-prefixed version, currentlynot supported by any browser */
        cursor: pointer;
        white-space: nowrap;
        font-size: 14px;
        font-family:
          PingFangSC-Regular,
          PingFang SC;
        font-weight: 400;
        color: #3b75ff;
        margin-right: 30px;
      }
    }
  }
}

// table
::v-deep .el-table {
  .el-table__cell {
    padding: 10px 0;
  }

  .has-gutter .cell {
    height: 25px;
    line-height: 25px;
  }

  .el-table__body .cell {
    height: 30px;
    line-height: 30px;
  }

  td.el-table__cell {
    border-bottom: 1px solid #f5f7fa;
  }

  .el-table__body tr.selection-row>td.el-table__cell {
    background-color: #f5f7fa;
  }

  .el-table__body-wrapper:has(.el-table__empty-block) {
    overflow: hidden;
  }
}

::v-deep .el-table .el-table__empty-block {
  width: 100% !important;
}

.page-list {
  height: calc(100% - 86px);
  background-color: #fff;
  border-radius: 8px;

  .list-top-box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 0px 0px 15px;
    box-sizing: border-box;
    height: 64px;

    .tab-box {
      padding-bottom: 15px;

      ::v-deep .el-tabs__header {
        margin: 0;
      }
    }

    .list-top-box-left {
      font-weight: 400;
      font-size: 14px;
      color: #adadad;
      margin: 0 10px 0 0;
      white-space: nowrap;
      padding-bottom: 15px;

      .num {
        color: #1b2431;
      }
    }

    .list-top-box-right {
      display: flex;
      align-items: center;
      padding: 0px 15px 15px 0px;

      &:has(.btns) {
        padding: 0px 5px 5px 0px;

        .list-top-box-left {
          padding-bottom: 10px;
        }
      }

      .list-top-box-right-left {
        display: flex;
        align-items: center;
        padding-right: 10px;
        margin-right: 10px;
        border-right: 1px solid #f5f7fa;

      }

      .btns {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;

        .el-button+.el-button {
          margin-left: 0;
        }

        .el-button {
          margin-right: 10px;
          margin-bottom: 10px;
        }
      }

      .list-top-box-left {
        font-weight: 400;
        font-size: 14px;
        color: #adadad;
        margin: 0 14px 0 0;
        padding-bottom: 0;

        .num {
          color: #1b2431;
        }
      }
    }
  }

  .table-box {
    width: 100%;
    height: calc(100% - 122px);
    overflow-y: auto;
    overflow-x: hidden;

    .img-list-box {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;

      .img-box {
        width: 30px;
        height: 30px;
        margin: 0 10px 10px 0;
        object-fit: cover;
      }
    }
  }

  ::v-deep .el-table::before {
    height: 0;
  }


  // table固定左部  列表遮挡滚动条问题
  ::v-deep .el-table__fixed {
    height: calc(100% - 8px) !important;

    &::before {
      display: none;
    }
  }

  .page-footer {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    padding: 10px;
    box-sizing: border-box;
  }
}

::v-deep .el-pagination {
  height: auto;
  padding: 4px 5px 0 5px;
}

::v-deep .el-button {
  padding: 10px 15px;
}

::v-deep .el-button--primary.is-disabled {
  color: #fff;
  background-color: rgba(61, 127, 255, 0.5);
  border-color: rgba(61, 127, 255, 0);
}

.search-top-left-box {

  ::v-deep .el-input__inner {
    height: 36px;
    line-height: 36px;
  }
}

::v-deep .el-dialog__wrapper {
  position: absolute !important;
}

::v-deep .v-modal {
  position: absolute !important;
  opacity: 0.35;
}

::v-deep .el-input__suffix {
  right: 10px;
  color: #5c5f66;
}

::v-deep .el-tag {
  height: auto;
  padding: 5px 10px;
  line-height: 12px;
  border: 0px;
}